<template>
  <yfu-dialog ref="roleManagerPermissionsDialog" :dialogParam="dialogParam" v-on:dialogOpenBefore="dialogOpenBefore" v-on:dialogCloseBefore="dialogCloseBefore">
    <div style="height:400px">
      <div style="float:left;width:40%;height:100%;">
        <yfu-listpanel :listPanelParam="listPanelParam" v-on:yfuListPanelClick="yfuListPanelClick" ref="roleManagerPanel">
        </yfu-listpanel>
      </div>
      <div style="float:left;width:50%;height:100%;margin-left:10px">
        <yfu-panel :panelParam="panelParam" v-on:yfuPanelSave="yfuPanelSave">
          <div >
            <yfu-tree :param="param" v-on:nodeClick="nodeClick"  ref="roleManagerPermissionsTree"> </yfu-tree>
          </div>
        </yfu-panel>

      </div>
    </div>
  </yfu-dialog>
</template>

<script>
  import { rolePermissionTree, updateRolePermission } from '@/view/api/permissionManager.js'
  import { yfuPost } from '@/utils/request.js'
  import { yfuSuccessToast } from '@/utils/yfuMessage.js'
  export default {
    data () {
      return {
        dialogParam: {
          title: '按功能模块添加权限',
          width: '50%',
          showFooter: false
        },
        listPanelParam: {
          title: '模块',
          width: '100%',
          height: '400px',
          baseURL: process.env.BASE_API,
          url: '/module/selectAll',
          urlParam: {
            currentPage: 1,
            pageSize: 10000
          },
          defaultSelected: 1,
          name: 'moduleName',
          showSearch: true,
          returnParam: {
            datas: 'list',
            defaultSelectedIndex: 0
          }
        },
        param: {
          showSearch: true,
          baseURL: process.env.BASE_API,
          url: rolePermissionTree.url,
          urlParam: {
            moduleId: undefined,
            roleId: undefined
          },
          showCheckBox: true,
          highLightCurrent: false,
          checkstrictly: true,
          width: '100%',
          height: '365px',
          defaultProps: {
            id: 'id',
            label: 'permissionName'
          },
          returnParam: {
            datas: 'checkedPermissionList',
            nodeDefaultClick: 'nodeDefaultClick',
            nodeDefaultCheckBox: 'checkedKeys'
          }
        },
        panelParam: {
          title: '模块权限',
          width: '100%',
          height: '100%',
          isShowButton: true
        }
      }
    },
    methods: {
      openDialog (row) {
        this.param.urlParam.roleId = row.id
        this.$refs.roleManagerPermissionsDialog.openDialog()

        if (this.$refs.roleManagerPanel != null) {
          this.$refs.roleManagerPanel.getData()
        }
      },
      // DIALOG 打开时执行方法
      dialogOpenBefore () {
        console.log('before')
      },
      closeDialog () {
        this.$refs.roleManagerPermissionsDialog.closeDialog()
      },
      // DIALOG 点击保存时 执行方法/同时关闭DIALOG
      dialogCloseBefore () {
        console.log('close')
        this.closeDialog()
      },
      // listPanelClick点击事件
      yfuListPanelClick (item) {
        console.log(item.id)
        this.param.urlParam.moduleId = item.id
        this.refresh()
      },
      // 树结点点击事件
      nodeClick (data) {
        console.log(data)
      },
      // 树结点得到选中项
      getAllCheckeds (data) {
        this.$refs.roleManagerPermissionsTree.getAllCheckeds()
      },
      // 树结点刷新
      refresh () {
        this.$refs.roleManagerPermissionsTree.refresh()
      },
      // 保存方法
      yfuPanelSave () {
        let selectChecked = []
        let permissionIds = []
        selectChecked = this.$refs.roleManagerPermissionsTree.getAllCheckeds()
        console.log(selectChecked)

        selectChecked.forEach((node, index) => {
          permissionIds.push(node.id)
        })

        let params = {}
        params.roleId = this.param.urlParam.roleId
        params.moduleId = this.param.urlParam.moduleId
        params.permissionIds = permissionIds.join()
        console.log(params)

        yfuPost(process.env.BASE_API, updateRolePermission.url, params,
          function (data) {
            console.log(data)
            yfuSuccessToast('权限保存成功！')
          },
          function (error) {
            console.log(error)
          }
        )
      }
    }
  }
</script>
